<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>角色管理</title>
    <link rel="stylesheet" href="../layui/css/layui.css">
</head>
<body>
<div style="padding:10px;background-color: #F2F2F2;">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-card">
                <div class="layui-card-header">消缺任务管理/消缺查询</div>
                <div class="layui-card-body">
                    <!--数据表格-->
                    <form  class="layui-form" method="" action="" style="margin-top: 30px;">
                    <div class="layui-form-item" >
                        <div class="layui-inline">
                            <label class="layui-form-label">任务编号</label>
                            <div class="layui-input-inline">
                                <input type="text" name="sovle_task" lay-verify="sovle_task" autocomplete="off" placeholder="请输入任务编号" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label">任务状态</label>
                            <div class="layui-input-inline">
                                <select name="sovle_state" >
                                    <option value="">请选择</option>
                                    <option value="8">待分配</option>
                                    <option value="5">已分配</option>
                                    <option value="6">执行中</option>
                                    <option value="6">已完成</option>
                                </select>
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label">缺陷类型</label>
                            <div class="layui-input-inline">
                                <select name="defect_id" >
                                    <option value="">请选择</option>

                                </select>
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label">缺陷级别</label>
                            <div class="layui-input-inline">
                                <select name="defect_grade" >
                                    <option value="">请选择</option>
                                    <option value="1">一般</option>
                                    <option value="2">严重</option>
                                    <option value="3">紧急</option>
                                </select>
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label">工作单据</label>
                            <div class="layui-input-inline">
                                <select name="work_id" >
                                    <option value="">请选择</option>
                                    <option value="1">第一单据</option>
                                    <option value="2">第二单据</option>
                                    <option value="3">任务单</option>
                                </select>
                            </div>
                        </div>
                        <div class="layui-inline" style="margin-top: 10px">
                            <label class="layui-form-label">下发时间</label>
                            <div class="layui-input-inline"> <!-- 注意：这一层元素并不是必须的 -->
                                <input type="text" placeholder="请选择时间" class="layui-input" id="test1" name="start_time">
                            </div>
                            <div class="layui-input-inline"> <!-- 注意：这一层元素并不是必须的 -->
                                <input type="text" placeholder="请选择时间" class="layui-input" id="test2" name="end_time">
                            </div>
                        </div>
                        <button type="button" lay-filter="query" lay-submit="query" id="query"  style="margin-left: 20px" class="layui-btn">查询</button>
                    </div>
                    </form>
                    <table class="layui-hide" id="emp_table" lay-filter="emp_table"></table>
                </div>
            </div>
        </div>
    </div>
</div>
</body>

<script>
    layui.use(['table','laydate','form'], function(){
        var table = layui.table,
            form=layui.form,
            laydate = layui.laydate;

        form.render("select");
        
        laydate.render({
            elem: '#test1' //指定元素
        });
        laydate.render({
            elem: '#test2' //指定元素
        });
        $.ajax({
            url:"/queryDefectType",
            type:"get",
            dataType:"json",
            success:function (data) {
                console.log(data);
                    $.each(data.data, function (index, value) {
                        $('select[name=defect_id]').append(new Option(value.defect_name,value.defect_id));// 下拉菜单里添加元素
                    });
                    layui.form.render("select");//重新渲染 固定写法
            }
        });

        table.render({
            elem: '#emp_table'
            ,url:'/querySovle.do'
            ,toolbar: '#toolbarDemo'
            ,title: '消缺查询'
            ,method:"get"
            ,totalRow: false
            ,cols: [[
                {field: 'sovle_task', title: '任务编号',sort: true, fixed: 'left'}
                ,{field: 'state_name', title: '任务状态'}
                ,{field: 'work_order_des', title: '工作单据' }
                ,{field: 'line_id', title: '线路编号' }
                ,{field: 'defect_grade_name', title: '缺陷级别' }
                ,{field: 'defect_name', title: '缺陷类型' }
                ,{field: 'find_name', title: '发现人' }
                ,{field: 'find_time', title: '发现时间' }
                ,{field: 'lssue_time', title: '下发时间' }
                ,{field: 'lssue_name', title: '下发人' }
                ,{field: 'intact', title: '完整率' }
                ,{field: 'defect_des', title: '缺陷描述' }
            ]]
            ,page:{
                limits:[5,10,15,20]
            }
        });
        //查询
        form.on('submit(query)', function(obj) {
                var data = JSON.stringify(obj.field);
                table.reload('emp_table', {
                    url: '/querySovle.do',
                    method:"post"
                    ,where: {data:data} //设定异步数据接口的额外参数
                });
        });
    });
</script>
</html>